<template>
  <div>
    <el-form ref="form" :model="form" label-width="80px" style="display: flex">
      <el-form-item label="审批类型">
        <el-select v-model="form.region" placeholder="请假">
          <el-option label="请假" value="请假"></el-option>
          <el-option label="车贷" value="车贷"></el-option>
          <el-option label="出差" value="出差"></el-option>
          <el-option label="加班" value="加班"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="申请人">
        <el-input placeholder="请输入账号"></el-input>
      </el-form-item>
      <el-form-item label="审批状态">
        <el-input placeholder="请输入状态"></el-input>
      </el-form-item>
    </el-form>
    <el-button size="small" icon="el-icon-search">查询</el-button>
    <el-button size="small" icon="el-icon-refresh-right">重置</el-button>
    <!-- 表格 -->
    <el-table :data="tableData" border style="width: 100%;margin-top: 40px;">
      <el-table-column fixed prop="id" label="id" align="center"> </el-table-column>
      <el-table-column prop="name" label="申请人" align="center"> </el-table-column>
      <el-table-column prop="province" label="审批类型" align="center"> </el-table-column>
      <el-table-column prop="city" label="审批时间" align="center"> </el-table-column>
      <el-table-column prop="address" label="当前审批人" align="center"> </el-table-column>
      <el-table-column prop="zip" label="审批状态" align="center"> </el-table-column>
      <el-table-column prop="zip" label="所属部门" walign="center"></el-table-column>
      <el-table-column fixed="right" label="操作" align="center" width="250">
        <template slot-scope="scope">
          <el-button @click="tg(scope.row)" style="background-color: rgb(212, 169, 233);color: white;"  size="mini">通过</el-button>
          <el-button @click="bh(scope.row)"  style="background-color: rgb(230, 84, 21);color: white;"  size="mini" >驳回</el-button>
          <el-button style="color:white;" type="primary" size="mini">详情</el-button>
        </template>
      </el-table-column>
    </el-table>

    <Tg ref="tg"/>
    <Bh ref="bh" />
  </div>
</template>
<script>
  import Tg from './Tg.vue'
  import Bh from './Bh.vue'
export default {
  components:{
  Tg,
  Bh
  },
  data() {
    return {
      tableData:[{
      name:'12'
      }],
      form: {
        region: ''
      }
    }
  },
  methods: {
    tg(){
    this.$refs.tg.dialogFormVisible=true
    },
    bh(){
    this.$refs.bh.dialogFormVisible=true
    },
  },
}
</script>

<style>
  .a{
  color: rgb(230, 84, 21);}
</style>